import React, { useEffect, useState } from 'react'
import { Space, Table, Button } from 'antd';
import { stuGet, stuDel } from '@/api/stu';
import { useRequest } from 'umi';
export default function List() {
    // let [data, setData] = useState([])
    // let [loading,setLoading]=useState(true);
    const columns = [
        {
            title: '姓名',
            dataIndex: 'name',
            key: 'name',
            render: (text) => <a>{text}</a>,
        },
        {
            title: '分数',
            dataIndex: 'score',
            key: 'score',
        },
        {
            title: '城市',
            dataIndex: 'city',
            key: 'city',
        },
        {
            title: '时间',
            dataIndex: 'time',
            key: 'time'
        },
        {
            title: '操作',
            key: 'action',
            render: (text, record, index) => (
                <Space size="middle">
                    <Button type="primary" size="small">编辑</Button>
                    <Button type="primary" size="small" danger onClick={() => {
                        // console.log(text,record)
                        stuDel(record.ID).then(res => {
                            data.splice(index, 1);//更新线下
                            setData([...data]);
                        })
                    }}>删除</Button>
                </Space>
            ),
        },
    ];

    // useEffect(() => {
    //     // 使用hooks发送api
    //     // 开启loading
    //     // stuGet().then(res => {
    //     //     console.log('res',res.results)
    //     //     setData(res.results)
    //     //     setLoading(false)
    //     // })
    // }, [])
    // 简化写法
    // let { data, loading, error } = useRequest(async () => {
    //     let res = await stuGet();
    //     return { data: res.results }
    // });

    let { data, loading, error } = useRequest(stuGet);
    return (
        <Table loading={loading} columns={columns} dataSource={data} rowKey='objectId' />
    )
}
